<template>
	<view class="index">
		<!-- #ifndef H5 -->
		<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" title="登录" color="#000"
			backgroundColor="">
		</uni-nav-bar>
		<!-- #endif -->
		<view :style="{height:`${configInfo.navBarHeight}px`}"></view>
		<view class="index-box">
			<view class="flex-center">
				<image class="logo" :src="configInfo.app_logo" mode="aspectFill"></image>
			</view>
			<view class="f-paragraph flex-center pt-sm">{{configInfo.terminal_slogan}}</view>
			<view class="index-btn">
				<view class="btn flex-center" :style="{backgroundColor: primaryColor,boxShadow: `0px 3px 7px ${primaryColor}`}" 
				@tap="$util.goUrl({url:`/login/pages/account`})">
					<view class="flex-y-center">
						<view class="iconfont iconpingguoshouji_iphone_2x c-base"></view>
						<text class="f-title c-base pl-sm">手机号登录</text>
					</view>
				</view>
				<!-- <view class="btn mt-lg flex-center" :style="{border: `1px solid ${primaryColor}`}" 
				 @tap="$refs.show_rule_item.open()">
					<view class="flex-y-center">
						<view class="icon-weixin iconfont" :style="{color: primaryColor}"></view>
						<text class="pl-sm f-title pl-sm" :style="{color:primaryColor}">微信登录</text>
					</view>
				</view> -->
				<!-- <view class=" pt-lg flex-center">
					<view class="flex pt-sm" @tap="isCheck = !isCheck ">
						<view class="icon-xuanze iconfont c-caption" v-if="!isCheck" ></view>
						<view class="iconjishiwancheng iconfont" v-else :style="{color:primaryColor}"></view>
						<view class="f-icontext box-text pl-sm">
							<text>注册即表示您已详细阅读并同意</text><text :style="{color:primaryColor}" @tap.stop="goDetail(1)">《用户隐私协议》</text><text>与</text>
							<text class="pt-sm"  @tap.stop="goDetail(2)" :style="{color:primaryColor}">《个人信息保护指引》</text>
						</view>
					</view>
				</view> -->
			</view>
		</view>
		<uni-popup ref="show_rule_item" type="center" :maskClick="false">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">温馨提示</view>
				<view class="f-desc c-title mt-lg">
					登录即表示您已详细阅读并同意<span @tap.stop="goDetail(1)" :style="{color:primaryColor}">
						《用户隐私协议》
					</span>与<span @tap.stop="goDetail(2)" :style="{color:primaryColor}">
						《个人信息保护指引》
					</span>
				</view>
				<view class="button">
					<view @tap.stop="$refs.show_rule_item.close()" class="item-child">取消</view>
					<view @tap.stop="goLogin" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">确定</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	import siteInfo from '@/siteinfo.js';
	export default {
		data() {
			return{
				isCheck:false,
			}
		},
		computed: mapState({
			primaryColor: state => state.config.configInfo.primaryColor,
			subColor: state => state.config.configInfo.subColor,
			configInfo: state => state.config.configInfo,
			userInfo: state => state.user.userInfo,
			location: state => state.user.location,
		}),
		async onLoad() {
			if(!this.configInfo.id ){
				await this.getConfigInfo({is_coach: 0})
			}
		},
		methods:{
			...mapActions(['getConfigInfo','getUserInfo','getMineInfo']),
			...mapMutations(['updateConfigItem', 'updateUserItem']),
			goLogin(){
				// #ifdef H5
					this.webLogin()
				// #endif
				// #ifdef MP-WEIXIN
					this.wxLogin()
				// #endif
			},
			//微信登录
			async wxLogin() {
				this.$refs.show_rule_item.close()
				try {
					let [providerErr, providerData] = await uni.getProvider({
						service: 'oauth',
					});
					let [loginErr, loginData] = await uni.login({
						provider: 'weixin'
					});
					let [infoErr, infoData] = await uni.getUserInfo({
						provider: 'weixin'
					})
					let {
						userInfo = {}
					} = infoData
					let {
						openId = ''
					} = userInfo
					if (!openId) return
					this.$util.showLoading({
						title: "登录中..."
					})
					try {
						this.toLogin(userInfo)
					} catch (e) {
						this.$util.hideAll()
					}
				} catch (e) {
					this.$util.showToast({
						title: '请先安装微信或升级版本'
					});
				}
			
			},
			async webLogin(){
				let pageUrl = window.location.href;
				let {
					gzh_appid: appid,
				} = siteInfo
				let redirect_uri = encodeURIComponent(pageUrl);
				let authUrl =
					`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE&connect_redirect=1#wechat_redirect`;
				window.location.href = authUrl;
			},
			async toLogin(userInfo) {
				console.log(userInfo)
				let user_info = await this.$api.base.appLogin({
					data: userInfo
				})
				this.updateUserItem({
					key: 'appLogin',
					val: userInfo
				})
				let {
					autograph,
					data
				} = user_info
				this.$util.hideAll()
				if(data){
					this.updateUserItem({
						key: 'userInfo',
						val: data
					})
				}
				
				if(autograph){
					this.updateUserItem({
						key: 'autograph',
						val: autograph
					})
				}
				
				if (!this.configInfo.id) {
					await this.getConfigInfo()
				}
				
				let {
					phone = ''
				} = data
				if(phone){
					this.getMineInfo()
				}
				//phone = 1
				this.$util.goUrl({
					url: phone ? `/pages/service` : `/user/pages/phone`,
					openType: `reLaunch`
				})
			},
			goDetail(type) {
				let {
					siteroot
				} = siteInfo
				let href = siteroot.split('index.php')[0]
				let page = type == 1 ? 'protocol' : 'information'
				let url = `${href}${page}.html`
				this.$util.goUrl({
					url,
					openType: 'web'
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #fff;
	}
	.index-box{
		padding-top: 96rpx;
		image.logo{
			width: 176rpx;
			height: 176rpx;
		}
		.index-btn{
			padding: 280rpx 80rpx 0 80rpx ;
			.btn{
				height: 94rpx;
				border-radius: 94rpx;
			}
		}
		.box-text{
			letter-spacing: 1px;
			line-height: 32rpx;
			color: #6C727F;
		}
	}
</style>